.space {
  display: grid;
  align-items: center;
  grid-auto-flow: column;
  grid-auto-columns: max-content;
  grid-gap: var(--spacing-tight);
}

.directionHorizontal {
  grid-auto-flow: column;
  align-items: center;
  grid-auto-columns: max-content;
}

.directionVertical {
  grid-auto-flow: row;
  justify-content: center;
  grid-auto-rows: max-content;
}

.alignStart {
  justify-content: flex-start;
}

.alignEnd {
  justify-content: flex-end;
}

.spread {
  width: 100%;
  justify-content: space-between;
}

.stretch .directionHorizontal {
  grid-auto-columns: 1fr;
  grid-auto-rows: 1fr;
}

.sizeLarge {
  grid-gap: var(--spacing-wider);
}

.sizeSmall {
  grid-gap: var(--spacing-tight);
}
